<template>
    <div class='y-anim' v-show="Yanim.show.value">
        <div id="yanim"></div>
    </div>
</template>
<script lang='ts' setup>
import { user } from '@/views/user/script/user';
import { onMounted } from 'vue';
import { Yanim } from './script/yanim';
onMounted(() => {
    if (Yanim.isActive && user.isLogin) {
        Yanim.active();
    }
})
</script>
<style lang='less' scoped>
.y-anim {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 150;

    #yanim {
        margin-inline: auto;
        margin-block: 35vh;
        width: 30vh;
        height: 30vh;
    }
}

@keyframes imganim {
    form {
        scale: 1;
    }

    50% {
        scale: 1.5;
    }

    to {
        scale: 1;
    }
}
</style>